require( '$d/css/common.less' );
require( './../style.less' );
define( [
  'require',
  'jquery',
  'message',
  'constants',
  'echarts',
  'bigwe_utils',
  'header',
], function( require, $, message, constants , echarts ) {
  var params = {
    u: '/topic/topic_compare',
    data: {},
    callBack: list,
  }

  var deploy_def = {
    u: '/topic/topic_info',
    data: {},
    callBack: deploy_info
  }
  var srce = {
    text: {
      'd.weibo.com': '新浪微博',
      'top.baidu.com': '百度风云榜',
      'top.sogou.com': '搜狗热搜榜',
      'top.so.com': '360热搜榜',
    },
    icon: {
      'd.weibo.com': 'icon-iconfontweibo',
      'top.baidu.com': 'icon-baidu',
      'top.sogou.com': 'icon-sougou red',
      'top.so.com': 'icon-icon-test',
    }
  }

  function myAjax( opt ) {
    message.show( '正在加载...' );
    $.ajax( {
      type: 'post',
      url: opt[ 'u' ],
      data: opt[ 'data' ],
      success: function( data ) {
        if ( $.isFunction( opt[ 'callBack' ] ) ) {
          opt[ 'callBack' ]( data );
        }
      },
      error: function( XMLHttpRequest, textStatus, errorThrown ) {
        console.log( textStatus );
        console.log( XMLHttpRequest.status );
        console.log( XMLHttpRequest.readyState );
      },
      complete: function() {
        message.hide();
      }
    } );
  }

  function list( data ) {
    var data = typeof data === 'string' ? $.parseJSON( data ) : data;
    var htm = '';

    if ( !data.data ) {
      htm = '<p class="no_content"><span class="glyphicon glyphicon-flash"></span>暂无内容</p>';
    } else {
      for ( i in data.data ) {
        var l = data.data[ i ];
        var n = '';
        ( l.read_value != '0' ) ? ( n = l.read_value ) : ( n = l.index_value );

        if ( n.toString().length > 5 && n.toString().length < 9 ) {
          n = Math.round( ( n / 10000 ) * 10 ) / 10 + '万';
        } else if ( n.toString().length >= 9 ) {
          n = Math.round( ( n / 100000000 ) * 10 ) / 10 + '亿';
        }

        var icon = '';
        if ( l.level == 0 ) {
          icon = 'icon-jian'
        } else if ( l.level == 1 ) {
          icon = 'icon-iconfontmovetoup green'
        } else {
          icon = 'icon-iconfontmovetodown'
        }
        htm += '<div class="box_inner" data-cd="' + l.cd + '" data-source="' + l.source + '" data-category="' + l.category + '"><div class="col_r_1"><button type="button" class="source"><span class="iconfont ' + srce.icon[ l.source ] + '"></span>' + srce.text[ l.source ] + '</button></div><div class="col_r_2"><strong class="topic_name">#' + l.title.toString().replace( /(#)/g, "" ) + '#</strong></div><div class="col_r_3 ranking">';
        if ( l.rank ) {
          htm += '<p class="ct_s_d">NO.' + l.rank + '<span class="iconfont ' + icon + '"></span></p>'
        } else {
          htm += '<p class="no_dt">--&nbsp;--</p>'
        }
        htm += '</div> <div class="col_r_4"><p class="ct_s_d">' + n + '</p></div> <div class="col_r_5"><p class="deploy_btn"><span>展开详解</span><span class="iconfont icon-xia"></span></p></div> <div class="col_r_6 shift_out">移出</div></div>';
      }
    }
    $( '.box_list' ).empty().append( htm );
  }

  var cont = $( '.main' )
  cont.on( 'click', '.shift_out', aside_remove );

  /*移出*/
  function aside_remove() {
    var t = $( this );
    var _cd = $( this ).parent().data( 'cd' );
    $.ajax( {
      type: 'post',
      url: '/_topic/del_topic',
      data: {
        cd: _cd
      },
      success: function( data ) {
        var d = typeof data === 'string' ? $.parseJSON( data ) : data;
        if ( d.ret == 0 ) {
          $( '[data-cd=' + _cd + ']' ).remove();
          var j = cont.find( '.box_inner' ).length;
          if ( j == 0 ) {
            var htm = '<p class="no_content"><span class="glyphicon glyphicon-flash"></span>暂无内容</p>';
            cont.find( '.box_list' ).append( htm );
          }
        }
      }
    } )
  }

  cont.on( 'click', '.deploy_btn', deploy );
  /*展开详情*/
  var contrast_num;

  function deploy() {
    var $t = $( this );
    var s = $t.data( 'show' );
    cont.find( '.box_inner' ).removeClass( 'diagram_info' );
    $t.parents( '.box_inner' ).addClass( 'diagram_info' );

    if ( $t.parents( '.box_inner' ).children( 'div' ).hasClass( 'deploy_info' ) ) {
      if ( s ) {
        $t.find( 'span:first-child' ).text( '展开详解' );
        $t.data( 'show', false ).attr( 'datd-show', false );
        $t.parents( '.box_inner' ).find( '.ct_s_d' ).show();
        $t.parents( '.box_inner' ).find( '.deploy_info' ).hide();
      } else {
        $t.find( 'span:first-child' ).text( '收起详解' );
        $t.data( 'show', true ).attr( 'datd-show', true );
        $t.parents( '.box_inner' ).find( '.ct_s_d' ).hide();
        $t.parents( '.box_inner' ).find( '.deploy_info' ).show();
      }
    } else {
      message.show( '正在加载...' );
      $t.data( 'show', true ).attr( 'datd-show', true );
      $t.find( 'span:first-child' ).text( '收起详解' );
      $t.parents( '.box_inner' ).find( '.ct_s_d' ).hide();
      deploy_def.data.cd = $t.parents( '.box_inner' ).data( 'cd' );
      deploy_def.data.category = $t.parents( '.box_inner' ).data( 'category' );
      deploy_def.data.source = $t.parents( '.box_inner' ).data( 'source' );
      contrast_num = $t.parents( '.box_inner' ).index() + 1;

      myAjax( deploy_def );
    }
  }

  function deploy_info( data ) {
    var d = typeof data === 'string' ? $.parseJSON( data ) : data;
    var _data = d.data.topic_info;

    var n = '';
    ( _data.read_value != '0' ) ? ( n = _data.read_value ) : ( n = _data.index_value );

    var icon = '';
    if ( _data.level == 0 ) {
      icon = 'icon-jian'
    } else if ( _data.level == 1 ) {
      icon = 'icon-iconfontmovetoup green'
    } else {
      icon = 'icon-iconfontmovetodown'
    }

    var htm = '';
    htm += '<div class="deploy_info"><div class="ranking_info"><p><span class="iconfont icon-statistic"></span>' + _data.category + '排名</p>';

    if ( _data.rank ) {
      htm += '<p>NO.' + _data.rank + '<span class="iconfont ' + icon + '"></span></p>'
    } else {
      htm += '<p class="no_dt">--&nbsp;--</p>'
    }

    htm += '</div><div class="follow_info"><p><span class="iconfont icon-collected"></span>';

    if ( _data.source == 'd.weibo.com' ) {
      htm += '新增关注'
    } else {
      htm += '搜索指数'
    }

    if ( n.toString().length > 5 && n.toString().length < 9 ) {
      n = Math.round( ( n / 10000 ) * 10 ) / 10 + '万';
    } else if ( n.toString().length >= 9 ) {
      n = Math.round( ( n / 100000000 ) * 10 ) / 10 + '亿';
    }

    htm += '</p><p>' + n + '</p></div><div id="diagram' + contrast_num + '" class="diagram"></div></div>';
    cont.find( '.diagram_info' ).append( htm );
    d.data.sort[ 0 ][ 'source' ] = _data.source;
    echarts_t( d.data.sort );
  }

  function echarts_t( json ) {
    var diagram = par_sort( json ),
      e_t = '';
    if ( json[ 0 ].source == 'top.baidu.com' ) {
      if ( diagram.x.length > 1 ) {
        e_t = diagram.x[ 0 ] + ' 至 ' + diagram.x[ diagram.x.length - 1 ] + ' 搜索指数趋势';
      } else {
        e_t = diagram.x[ 0 ] + ' 搜索指数趋势';
      }
    } else {
      if ( diagram.x.length > 1 ) {
        e_t = diagram.x[ 0 ] + ' 至 ' + diagram.x[ diagram.x.length - 1 ] + ' 新增关注趋势';
      } else {
        e_t = diagram.x[ 0 ] + ' 新增关注趋势';
      }
    }

    var myChart = echarts.init( document.getElementById( 'diagram' + contrast_num ) );
    // 图表使用-------------------
    var option = {
      legend: {
        orient: 'horizontal',
        x: 'center',
        y: 'bottom',
        selectedMode: false,
        data: [ {
          name: e_t,
          icon: 'circle',
          textStyle: {
            fontSize: 15,
            color: '#333'
          },
        }, ]
      },
      tooltip: {
        trigger: 'axis',
      },
      xAxis: [ {
        data: diagram.x,
      } ],
      yAxis: [ {
        boundaryGap: [ 0, 0.1 ],
      } ],
      series: [ {
        name: e_t,
        type: 'line',
        data: diagram.y,
      } ],
      color: [ '#4a90e2' ],
    };
    myChart.setOption( option );
  }

  // function par_sort(json) {
  //     var x = [],
  //         y = [];
  //     for (i in json) {
  //         x[i] = new Date(json[i].data_time).format('yyyy-MM-dd');
  //         y[i] = json[i].interfix_value;
  //     }
  //     return {
  //         x: x.reverse(),
  //         y: y.reverse(),
  //     };
  // }

  function par_sort( json ) {
    var d = [];
    for ( i in json ) {
      d[ json[ i ].day_code ] = json[ i ].interfix_value;
    }

    var date = new Date();
    var day_mm = 24 * 60 * 60 * 1000,
      x = [],
      y = [];

    for ( i = 0; i < 7; i++ ) {
      var t = new Date( date - ( i * day_mm ) );
      var year = t.getFullYear(),
        min = t.getMonth() + 1,
        day = t.getDate();
      x[ i ] = t.format( 'yyyy-MM-dd' );

      if ( d[ t.format( 'yyyyMMdd' ) ] ) {
        y[ i ] = d[ t.format( 'yyyyMMdd' ) ];
      } else {
        y[ i ] = 0;
      }
    }
    return {
      x: x.reverse(),
      y: y.reverse(),
    };
  }

  $( '.search_area .search_item' ).eq( 0 ).addClass( 'selected' );
  myAjax( params );
} )
